import React, {Component, PropTypes} from 'react';
import {Link} from 'react-router';

import {_Card,_Tooltip} from 'ANT_DE';
const Card = _Card,
    Tooltip = _Tooltip;

export default class  extends Component {
    constructor(props) {
        super(props);
        this.state = {
            num:0,
            inline:0
        }
        this.tany = 0;
    }



    //asdassadasdasdads
    componentWillMount(){
        let num = 0,current;
        const {sendQuanty,acceptQuanty,quanty} = this.props.data;

        this.props.isSend ? current = acceptQuanty : current = sendQuanty;

        num = ((current / quanty) *100).toFixed(2);

        this.tany = Number(num);
    }

    //sdsdads
    //// data ? ((data.quanty - data.remainQuanty)/data.quanty) : 0,
    componentDidMount(){
        let num = 0,
            {sendQuanty,quanty,acceptQuanty}=this.props.data;

        let tyu = this.tany,
            inline = parseFloat(sendQuanty) >= parseFloat(quanty) ? 100 : tyu

        if(Number.isNaN(tyu)) { return }
        let changeNum = ()=>{
            if( this.state.num >= tyu){
                this.setState({num:tyu});
                clearInterval(set);
            }else{
                this.setState({
                    num:num+=8
                })
            }
        };
        let set = setInterval(changeNum,50);
        // data ? ((data.quanty - data.remainQuanty)/data.quanty) * 160 : ""
        setTimeout(()=>{
            this.setState({inline})
        },100)
    }
    render() {
        const {
            className,
            title,
            data,
            isSend,
            link_path
        }  = this.props;

        let  num = 0,inline = 0,current_quanty;

        current_quanty = isSend ? data.acceptQuanty : data.sendQuanty;

            num = this.state.num;
            inline= this.state.inline;

        // const style =
        const name = data ? isSend ? data.partaName : data.partbName : "";


        //w1 { data ? ((data.quanty - data.remainQuanty)/data.quanty * 100) : 0 }
        return <Tooltip title={ name } overlayClassName="order_Tree--Card___alarm">
            <div className={ "order_Tree--Card " + className}>
                <div className="order_Tree--Card__title">
                    {name ? name.slice(0,6) : name}
                </div>
                <div className="order_Tree--Card__content">
                    <div className="order_Tree--Card___detail">
                        <div className="order_Tree--Card___item">
                            <span> {isSend ? "收货进度：" : "发货进度："} </span>
                            <strong> {num}% </strong>
                        </div>

                        <p className="order_Tree--progress">
                            <i style={this.state.inline!=0 ? { width: `${inline}%`} : {}}></i>
                        </p>
                        <p className="order_Tree--detail___num">
                            <span>{data ? current_quanty : ""} </span>/

                            <span>{ data ? data.quanty + "件" : "" }</span>
                        </p>
                    </div>
                </div>
            </div>
        </Tooltip>
    }
}